<template>
  <base-dialog  title="传阅回执统计数据"
                v-bind="$attrs"
                size="medium"
                v-on="$listeners" no-button>
        <scroll-panel height="calc(90vh - 120px)">
        <top-radio-group :list="countList" @handleChange="getDocumentDistInfo"></top-radio-group>
        <el-table
                :data="info.value"
                class="full-width"
                row-key="id"
                v-loading="loading"
        >
            <el-table-column align="left" type="index" label="序号" min-width="60">
                <template slot-scope="scope">
                    {{(queryParams.page-1)*queryParams.per_page+scope.$index+1}}
                </template>
            </el-table-column>
            <my-table-column align="left" prop="user_info.dept" label="接收部门">
            </my-table-column>
            <el-table-column align="left" prop="user_info.alias" label="接收人员">
            </el-table-column>
            <my-table-column align="left" prop="creator_info.dept" label="发送部门">
            </my-table-column>
            <el-table-column align="left" prop="creator_info.alias" label="发送人员">
            </el-table-column>
            <el-table-column align="left" prop="remarks" label="批示">
            </el-table-column>
            <el-table-column align="left" prop="unread" label="状态" width="80">
                <template slot-scope="{row}">
                    <span v-if="row.unread" class="redSpan">未读</span>
                    <span v-else>已读</span>
                </template>
            </el-table-column>
        </el-table>
        <pagination
                v-show="info.total > 0"
                :total="info.total"
                :page.sync="queryParams.page"
                :limit.sync="queryParams.per_page"
                @pagination="getDocumentDistInfo"
        />
        </scroll-panel>
  </base-dialog>
</template>

<script>
    import schoolSignature from "@/api/officialDocument/schoolSignature/index"
    import TopRadioGroup from "./topRadioGroup";
    import BaseDialog from "@/components/Common/BaseDialog";
    import MyTableColumn from "../../../components/TableColumn/MyTableColumn";
    import ScrollPanel from "../../../components/Common/ScrollPanel";
    export default {
        name: "CountDetailDialog",
        components: {ScrollPanel, MyTableColumn, BaseDialog, TopRadioGroup},
        data() {
            return {
                dialogVisible: false,
                info: {value:[],total:0,r_count:0,u_count:0},
                queryParams:{
                    page:1,
                    per_page:10,
                    document:undefined,
                    unread:undefined
                },
                loading:false,
                countList:[{label:undefined,name:"总数",num:0},{label:0,name:"已读",num:0},{label:1,name:"未读",num:0}]
            };
        },
        props:["id"],
        created() {
            this.queryParams.document=this.id
            this.getDocumentDistInfo()
        },
        methods: {
            unreadFormatter(row){
                return row.unread?"未读":"已读"
            },
            handleClose(done) {
                this.$emit("update:visible", false)
            },
            //获取未读通知及列表
            getDocumentDistInfo(value) {
                this.loading = true
                this.queryParams.unread=value
                schoolSignature.getDocumentDistInfo(this.queryParams).then(res=>{
                    this.info = res.data;
                    if(this.queryParams.unread == undefined){
                        this.countList[0].num = this.info.total
                        this.countList[1].num = this.info.r_count
                        this.countList[2].num = this.info.u_count
                    }
                    this.loading = false
                }).catch(res=>{
                    this.loading = false
                })
            },
        }
    };
</script>
<style lang="scss" scoped>
  ::v-deep .el-dialog{
       width: 800px;
    }
</style>
